<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>JQuery - 1</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <style>
            div {
                width: 50px;
                height: 50px;
                opacity: 0.25;
                background-color: #888;
            }

        </style>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
        <script>
            $(document).ready(function(){
                var temp = 1;
                
                $("div").click(function(){
                    if(temp==1) {
                        $("div").animate({height: "500px", width:"500px", opacity:1}, {duration:2000});
                        temp = 2;
                    }
                    else {
                        $("div").animate({height: "50px", width:"50px", opacity:0.25}, {duration:2000});
                        temp = 1;
                    }
                });
            });
        </script>
    </head>
    <body>
        <div></div>
    </body>
</html>
